import 'package:flutter/material.dart';

///flutter 中的列表通常有以下分类
///水平、 垂直、 矩阵和数据量超级大的列表
class EgListView extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final _title = "基础列表实例";
    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(
          title: Text(_title),
        ),
        body: new ListView(
          children: <Widget>[
            ListTile(leading: Icon(Icons.alarm), title: Text("Alarm")),
            ListTile(
              leading: Icon(Icons.phone),
              title: Text("Phone"),
            ),
            ListTile(
              leading: Icon(Icons.print),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.info),
              title: Text("士力架"),
            ),
            ListTile(
              leading: Icon(Icons.map),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.remove),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.print),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.print),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.accessibility),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.print),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.print),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.favorite_border),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.favorite),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.print),
              title: Text("打印机"),
            ),
            ListTile(
              leading: Icon(Icons.print),
              title: Text("打印机"),
            ),
          ],
        ),
      ),
    );
  }
}

class EgHorizontalListView extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final _title = "横向列表";

    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(title: new Text(_title)),
        body: Container(
          margin: EdgeInsets.symmetric(vertical: 20.0),
          height: 200.0,
          child: ListView(
            scrollDirection: Axis.horizontal,
            children: <Widget>[
              Container(
                width: 160,
                color: Colors.brown,
              ),
              Container(
                width: 140,
                color: Colors.red,
              ),
              Container(
                width: 160,
                color: Colors.green,
              ),
              Container(
                width: 180,
                color: Colors.deepOrange,
                child: Column(
                  children: <Widget>[
                    Text(
                      "水平",
                      style: TextStyle(fontWeight: FontWeight.bold, fontSize: 36),
                    ),
                    Text(
                      "列表",
                      style: TextStyle(fontWeight: FontWeight.normal, fontSize: 20),
                    ),
                    Icon(Icons.list)
                  ],
                ),
              ),
              Container(
                width: 160,
                color: Colors.green,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class LongListView extends StatelessWidget {
  final List<String> items;

  LongListView({Key key, @required this.items}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final _title = "长列表示例";

    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(
          title: Text(_title),
        ),
        body: new ListView.builder(itemBuilder: (context, index) {
          return new ListTile(
            leading: new Icon(Icons.pan_tool),
            title: new Text("${items[index]}"),
          );
        }),
      ),
    );
  }
}
